<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <style>
    body {
      width: 200px;
      padding: 10px;
    }
    .switch {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 10px;
    }
    .font-select {
      width: 100%;
      margin-top: 10px;
      padding: 5px;
    }
    label {
      display: block;
      margin-bottom: 5px;
    }
  </style>
</head>
<body>
  <div class="switch">
    <span>文本RTL模式</span>
    <input type="checkbox" id="rtlToggle">
  </div>
  <div class="switch">
    <span>文本两端对齐</span>
    <input type="checkbox" id="justifyToggle">
  </div>
  <div>
    <label>字体大小</label>
    <select id="fontSizeSelect" class="font-select">
      <option value="">默认大小</option>
      <option value="12px">12px</option>
      <option value="14px">14px</option>
      <option value="16px">16px</option>
      <option value="18px">18px</option>
      <option value="20px">20px</option>
    </select>
  </div>
  <div>
    <label>字体选择</label>
    <select id="fontSelect" class="font-select">
      <option value="">默认字体</option>
      <option value="UKIJ Ekran">UKIJ Ekran</option>
      <option value="UKIJ Qara">UKIJ Qara</option>
      <option value="ALKATIP">ALKATIP</option>
      <option value="ALKATIP Basma">ALKATIP Basma</option>
    </select>
  </div>
  <script src="popup.js"></script>
</body>
</html> 